<template>
	<view class="box">
		<!-- 我的喜好 -->
		<!-- 喜好内容 -->
		<view class="likeContent">
			<view class="ILike">
				<span class="ILike_span">我的喜好</span>
				<view class="ILike_content" style="margin-top: 13rpx;">
					<view class="ILike_content_item" v-for="(item,index) in myHomepage" :key="index+'ss'">
						<image class="images" :src="item.imgUrl" mode=""></image>
						<span class="ILike_content_item_span">{{item.name}}</span>
					</view>
					<view class="ILike_content_item" v-for="(i,j) in xhqbList" :key="i.id">
						<image class="images" :src="i.image" mode=""></image>
						<span class="ILike_content_item_span">{{i.name}}</span>
						<img class="qx" src="https://pic.bangbangtongcheng.com/static/bbcz/wdxh/wdxhj01.png" @click="qxClick(i)">
					</view>
				</view>
			</view>
			<view class="ILike" style="margin-top: 24rpx;" v-if="xzqbList.length!=0">
				<span class="ILike_span">新增</span>
				<view class="ILike_content" style="margin-top: 23rpx;">
					<view class="ILike_content_item" v-for="(i,j) in xzqbList" :key="i.id">
						<image class="images" :src="i.image" mode=""></image>
						<span class="ILike_content_item_span">{{i.name}}</span>
						<img class="xz" src="https://pic.bangbangtongcheng.com/static/bbcz/wdxh/wdxhj02.png" @click="xzClick(i)">
					</view>
				</view>
			</view>
		</view>
		<uniBall></uniBall>
	</view>
</template>
<script>
	import {
		mapGetters
	} from "vuex";
	let statusBarHeight;
	//#ifdef H5
	import wxshare from "../../utils/index.js";
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 10;
	//#endif
	// #ifdef APP-PLUS
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 10;
	//  #endif
	// #ifdef MP-WEIXIN
	statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 5;
	//  #endif
	export default {
		data() {
			return {
				statusBarHeight,
				text: "管理",
				userInfo: uni.getStorageSync("Pduser"),
				imgUrl: this.$imgSrc,
				myHomepage:[
					{
						id:1,
						name:"我的主页",
						imgUrl:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/wdzy01.png",
					},
					{
						id:19,
						name:"帮帮安巢",
						imgUrl:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/bbac01.png",
					},
					{
						id:20,
						name:"帮帮车主",
						imgUrl:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/bbcz01.png",
					},
					{
						id:21,
						name:"帮帮招才",
						imgUrl:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/bbzc01.png",
					},
				],
				xzList:[{
						id:2,
						name:"地图找车",
						image:"https://pic.bangbangtongcheng.com/5a0cb3b93ed244b9b99c30e6594b166f",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/mapCarSearch.png",
						path:"/pages_mapFind/mapHouse",
						sign:false,
					},{
						id:3,
						name:"地图找房",
						image:"https://pic.bangbangtongcheng.com/46219d8d88864267af519984bad07196",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/findRoomMap.png",
						path:"/pages_index/mapHouse",
						sign:false,
					},{
						id:4,
						name:"房源信息",
						image:"https://pic.bangbangtongcheng.com/276beef2c430472c81b737820d337fac",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/housInformation.png",
						path:"/pages_houses/housing/index",
						sign:false,
					},{
						id:5,
						name:"在售楼盘",
						image:"https://pic.bangbangtongcheng.com/47a265dbd66a4fae90ece7f3329f8fed",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/propertySale.png",
						path:"/pages_houses/houses/index",
						sign:false,
					},{
						id:6,
						name:"中介",
						image:"https://pic.bangbangtongcheng.com/d1ac01a48e70477e92f7b7cbb20f53ba",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/intermediary.png",
						path:"/pages/intermediary/index",
						sign:false,
					},{
						id:7,
						name:"二手房",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/esf01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/secondHandHouse.png",
						path:"/pages_houses/housing/oldHouse",
						sign:false,
					},{
						id:8,
						name:"新房",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xf01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/newHouse.png",
						path:"/pages_houses/housing/newHouse",
						sign:false,
					},{
						id:9,
						name:"出租房",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/esf01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/rentalHouse.png",
						path:"/pages_houses/housing/renting",
						sign:false,
					},{
						id:10,
						name:"车源信息",
						image:"https://pic.bangbangtongcheng.com/6dc13395e02b40259aabff8d48a75600",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/vehicleSource.png",
						path:"/pages_owner/carSource/index",
						sign:false,
					},{
						id:11,
						name:"经销商",
						image:"https://pic.bangbangtongcheng.com/6bd0898ce217489a9de53637810be0bc",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/distributor.png",
						path:"/pages_owner/dealer/index",
						sign:false,
					},{
						id:12,
						name:"车主服务",
						image:"https://pic.bangbangtongcheng.com/a4268b514af44adbbd87f86d5455d5b0",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/ownerService.png",
						path:"/pages_owner/ownerService/index",
						sign:false,
					},{
						id:13,
						name:"到店新车",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/ddxc02.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/newCarStore.png",
						path:"/pages_owner/carSource/toStoreNewCar",
						sign:false,
					},{
						id:14,
						name:"二手车",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/esc02.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/usedCar.png",
						path:"/pages_owner/carSource/usedCar",
						sign:false,
					},{
						id:15,
						name:"美容装饰",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/mrzs02.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/beautyDecoration.png",
						path:"/pages_owner/ownerService/beautyDecoration",
						sign:false,
					},{
						id:16,
						name:"维修保养",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/qcwx01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/Maintenance.png",
						path:"/pages_owner/ownerService/maintenance",
						sign:false,
					},{
						id:17,
						name:"4S店",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/4s01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/4SShop.png",
						path:"/pages_owner/dealer/sAutoShop",
						sign:false,
					},{
						id:18,
						name:"汽贸店",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/qmd01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/autoTradeShop.png",
						path:"/pages_owner/dealer/qiMaoShop",
						sign:false,
					},
					{
						id:22,
						name:"招才信息",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/zcxx01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/zcxx02.png",
						path:"/pages_recruitMoney/recruitmentInformation/index",
						sign:false,
					},
					{
						id:23,
						name:"人才简历",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/rcjl01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/rcjl02.png",
						path:"/pages_recruitMoney/resume/index",
						sign:false,
					},
					{
						id:24,
						name:"地图招才",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/dtzc01.png",
						image2:"https://pic.bangbangtongcheng.com/static/LevitationBall/dtzc02.png",
						path:"/pages_mapFind/zcMapHouse",
						sign:false,
					},
					{
						id:25,
						name:"俱乐部",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_byjlb.png",
						image2:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_xfq_byjlb.png",
						path:"/pages_my/bangClub",
						sign:false,
					},
					{
						id:26,
						name:"帮友圈",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_byq.png",
						image2:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_xfq_byq.png",
						path:"/pages/index/friendsCircle",
						sign:false,
					},
					{
						id:27,
						name:"发布",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_fb.png",
						image2:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_xfq_fb.png",
						path:"/pages_mapFind/zcMapHouse",
						sign:false,
					},
					{
						id:28,
						name:"消息",
						image:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_xx.png",
						image2:"https://pic.bangbangtongcheng.com/static/bbcz/wdxh/xh_xfq_xx.png",
						path:"/pages/news/index",
						sign:false,
					},
				],
				xhqbList:[],
				xzqbList:[],
			};
		},
		computed: {
			...mapGetters(["statusBarHeight1", "userinfo"]),
		},
		onLoad() {
			// this.myBeFondOf()
			// 从本地拿到数据
			this.getData()
			/* #ifdef H5 */
			this.jinzhi();
			/* #endif */
		},
		filters: {
			nums(val) {
				return val.toFixed(2);
			},
		},
		methods: {
			guanLi() {
				if (this.text == "管理") {
					this.text = "完成";
				} else {
					this.text = "管理";
				}
			},
			fanhui(){
				uni.navigateBack({
					delta: 1
				});
			},
			getData(){
				let arr=[]
				arr=uni.getStorageSync("whatLike")
				if (arr && (this.xzList.length == arr.length)) {
					this.xzList=arr
				}
				this.xzList.forEach(v=>{
					if (v.sign) {
						this.xhqbList.push(v)
					}else{
						this.xzqbList.push(v)
					}
				})
			},
			qxClick(item){
				this.xzList.forEach(v=>{
					if (v.id==item.id) {
						v.sign=false
					}
				})
				uni.setStorageSync('whatLike', this.xzList);
				this.xhqbList=this.xhqbList.filter(v=>{
					if (v.id!=item.id) {
						return v
					} 
				})
				this.xzqbList.push(item)
			},
			xzClick(item){
				if(this.xhqbList.length == 7){
					uni.showToast({
						title: "最多放置11个喜好！",
						icon: "none",
						mask: true
					});
					return
				}
				this.xzList.forEach(v=>{
					if (v.id==item.id) {
						v.sign=true
					}
				})
				uni.setStorageSync('whatLike', this.xzList);
				this.xzqbList=this.xzqbList.filter(v=>{
					if (v.id!=item.id) {
						return v
					} 
				})
				this.xhqbList.push(item)
			},
			// 获取全部喜好
			// myBeFondOf(){
			// 	this.xzqbList=[]
			// 	this.xzList=[]
			// 	this.$myRequest
			// 	.get("/api/mobile/public/getPersonalPreferences",{
			// 		userId:this.userInfo.id
			// 	})
			// 	.then((res) => {
			// 		res.preferences.pageList.forEach(v=>{
			// 			if (v.id==0) {
			// 				this.xzqbList.push(v)
			// 			}else{
			// 				this.xzList.push(v)
			// 			}
			// 		})
			// 	});
			// },
			// qxClick(item){
			// 	this.$myRequest
			// 	.post("/api/mobile/public/increaseOrRemovepPersonalPeferences",{
			// 		id:item.id,
			// 	})
			// 	.then((res) => {
			// 		uni.showToast({
			// 			title: res.msg,
			// 			icon: "none",
			// 			mask: true
			// 		});
			// 		this.myBeFondOf()
			// 	});
			// },
			// xzClick(item){
			// 	this.$myRequest
			// 	.post("/api/mobile/public/increaseOrRemovepPersonalPeferences",{
			// 		preferencesId:item.preferencesId,
			// 		userId:this.userInfo.id
			// 	})
			// 	.then((res) => {
			// 		uni.showToast({
			// 			title: res.msg,
			// 			icon: "none",
			// 			mask: true
			// 		});
			// 		this.myBeFondOf()
			// 	});
			// },
			jinzhi() {
				let _this = this;
				let param = window.location.href.split("#")[0];
				uni.request({
					method: "post",
					data: {
						url: param
					},
					header: {
						"content-type": "application/x-www-form-urlencoded",
					},
					url: "https://www.bangbangtongcheng.com/conven//mob/login/getJsTicket.do",
					success(re) {
						_this.jinzhifx(re.data);
					},
				});
			},
			jinzhifx(data) {
				wxshare.config({
					debug: false, //是否打开调试
					appId: data.appId, // 公众号的唯一标识
					timestamp: data.timestamp, // 生成签名的时间戳
					nonceStr: data.nonce, // ，生成签名的随机串
					signature: data.signature, // 签名
					jsApiList: ["hideMenuItems"],
				});
				// 禁止分享
				wxshare.hideMenuItems({
					// 要隐藏的菜单项，只能隐藏“传播类”和“保护类”按钮，所有menu项见附录3
					menuList: [
						"menuItem:share:appMessage",
						"menuItem:share:timeline",
						"menuItem:share:timeline",
						"menuItem:share:qq",
						"menuItem:favorite",
						"menuItem:share:QZone",
						"menuItem:openWithSafari",
					],
				});
			},
		},
	};
</script>
<style lang="less" scoped>
	
	.box {
		width: 100%;
		padding-top: 40rpx;
	}
	page{
		// height: 100vh;
		background-color: #f1f1f1;
	}
	.tou {
		position: sticky;
		top: 0;
		width: 100%;
		text-align: center;
		/* #ifdef MP-WEIXIN */
		text-align: left;
		display: flex;
		align-items: center;
		/* #endif */
		line-height: 88rpx;
		font-size: 36rpx;
		color: #fff;
		background-color: #64b6a8;

		.image1 {
			position: absolute;
			width: 32rpx;
			height: 32rpx;
			left: 30rpx;
		}

		.p2 {
			position: absolute;
			bottom: 0rpx !important;
			right: 30rpx;
			/* #ifdef MP-WEIXIN */
			position: initial;
			margin-left: auto;
			margin-right: 200rpx;
			bottom: 16rpx !important;
			/* #endif */
		}
	}
	.likeContent{
		margin: 0 30rpx;
		// height: 100vh;
		.ILike{
			.ILike_span{
				font-size: 30rpx;
				font-weight: 600;
				color: #333333;
			}
			.ILike_content{
				width: 690rpx;
				background-color: #FFFFFF;
				box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(102,102,102,0.17);
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				padding-top: 40rpx;
				border-radius: 20rpx;
				.ILike_content_item{
					width: 25%;
					height: 100%;
					display: flex;
					flex-direction: column;
					align-items: center;
					margin-bottom: 40rpx;
					position: relative;
					.ILike_content_item_span{
						font-size: 24rpx;
						font-weight: bold;
						color: #666666;
					}
					.images{
						width: 70rpx;
						height: 70rpx;
					}
					.qx{
						width: 30rpx;
						height: 30rpx;
						position: absolute;
						top: 0;
						right: 40rpx;
					}
					.xz{
						width: 30rpx;
						height: 30rpx;
						position: absolute;
						top: 0;
						right: 40rpx;
					}
				}
			}
		}
	}
</style>
